package com.bawei.composeui2207a.day04

import androidx.compose.foundation.background
import androidx.compose.foundation.border
import androidx.compose.foundation.layout.Arrangement
import androidx.compose.foundation.layout.Box
import androidx.compose.foundation.layout.Column
import androidx.compose.foundation.layout.fillMaxWidth
import androidx.compose.foundation.layout.height
import androidx.compose.foundation.layout.padding
import androidx.compose.foundation.lazy.grid.GridCells
import androidx.compose.foundation.lazy.grid.LazyVerticalGrid
import androidx.compose.foundation.lazy.grid.items
import androidx.compose.material3.Button
import androidx.compose.material3.Card
import androidx.compose.material3.CardDefaults
import androidx.compose.material3.Text
import androidx.compose.runtime.Composable
import androidx.compose.runtime.LaunchedEffect
import androidx.compose.runtime.remember
import androidx.compose.runtime.snapshots.SnapshotStateList
import androidx.compose.ui.Modifier
import androidx.compose.ui.graphics.Color
import androidx.compose.ui.layout.ContentScale
import androidx.compose.ui.res.painterResource
import androidx.compose.ui.tooling.preview.Preview
import androidx.compose.ui.unit.dp
import androidx.navigation.NavController
import androidx.navigation.compose.rememberNavController
import coil.compose.AsyncImage
import com.bawei.composeui2207a.R
import com.bawei.composeui2207a.model.GoodEntity
import com.bawei.composeui2207a.model.RetrofitManager
import kotlinx.coroutines.Dispatchers
import kotlinx.coroutines.flow.flowOn

/**
 * 作者：赵亮
 * 时间：2024/12/13 10:57
 * 功能：主页面-展示商品网格
 */
@Composable
fun MainPage(navController: NavController = rememberNavController(), name: String = "") {

    // 1. 请求商品网格数据
    var list = remember {
        SnapshotStateList<GoodEntity.Result>()
    }
    LaunchedEffect(key1 = "") {
        RetrofitManager.apiService.findCommodityByKeyword("鞋", 1, 10)
            .flowOn(Dispatchers.IO)
            .collect {
                list.addAll(it.result)
            }
    }

    // 2. 展示商品网格数据
    Column (modifier = Modifier.background(color = Color.Gray).padding(horizontal = 10.dp)){
        Text(text = "商品列表")
        LazyVerticalGrid(
            horizontalArrangement = Arrangement.spacedBy(10.dp),
            verticalArrangement = Arrangement.spacedBy(10.dp),
            columns = GridCells.Fixed(2)) {
            items(list) {
                Card(
                    elevation = CardDefaults.cardElevation(0.dp),
                    colors = CardDefaults.cardColors(containerColor = Color.White)
                ) {
                    Column (modifier = Modifier.padding(10.dp)){
                        AsyncImage(
                            modifier = Modifier.fillMaxWidth().height(150.dp),
                            contentScale = ContentScale.Crop,
                            placeholder = painterResource(id = R.drawable.profile_picture),
                            error = painterResource(id = R.drawable.sunwukong),
                            model = it.masterPic, contentDescription = null
                        )
                        Text(text = it.commodityName, maxLines = 1)
                    }
                }
            }
        }
    }

}

@Preview
@Composable
fun MainPagePreview() {
    MainPage()
}

